{% extends '/pg/index.html' %}
{% block operation %}

<ul class="breadcrumb">
  <li><a href="/pg">Home</a></li>
  <li><a href="/pg/abbinamenti">Abbinamenti</a></li>
  <li class="active">Ruoli - Azioni</li>
</ul>
        <div class="field text tdSez" title=""><b>Seleziona un ruolo su cui operare</b></div>

<form class="form-horizontal" id="ae_form" action="/pg/cu_RuoliAzioni/Create" method="post" role="form">

    <div class="form-group">
        <label class="col-sm-2 col-lg-2 control-label" for="id_role" >Ruolo:</label>
        <div class="col-sm-5 col-lg-5">
            <select style="height:40px;width:200px;" id="id_role" name="id_role" class="validate[required]" >
                <option value=""></option>
                {% for t in pageData['ruoli'] %}
                        <option value="{{t.id}}" >{{t.name}}</option>
                {% endfor %}
            </select>
        </div>
    </div>
    <div class="form-group" title="Bottoni di salvataggio e reset del form">
        <input class="btn btn-default" type="button" id="add_all" value="Aggiungi tutti" name="add"/>
        <input class="btn btn-default" type="button" id="remove_all" value="Rimuovi tutti" name="add"/>
    </div>

    <div class="form-group" >
        <div class="col-sm-10 col-lg-10">
            <select style="width:500px;" id="id_roleaction" name="id_roleaction" multiple>
                {% for t in pageData['azioni'] %}
                    <option title="" value="{{t.id}}" ><p>{{t.denominazione_breve}} ({{t.denominazione}})</p></option>
                {% endfor %}
            </select>
        </div>
    </div>
    <div class="form-group" title="Bottoni di salvataggio e reset del form">
        <input class="btn btn-primary" type="submit" value="Salva" name="add"/>
    </div>
</form>

{%endblock%}
{% block custom_js %}
<link rel="stylesheet" type="text/css" href="/tpl/pg/js/plugins/multi-select-master/css/multi-select.css" />
<script src="/tpl/pg/js/plugins/multi-select-master/js/jquery.multi-select.js" ></script>

<script type="text/javascript">
$(document).ready(function () {
$("#ae_form").validationEngine({
                    prettySelect : true,
                    useSuffix: "_chosen",});
$(".Preview").hide()
$("a#anteprima").hide()
$(".Edit_dao").hide()
$( "#id_role" ).chosen({
                    disable_search:true,
                    allow_single_deselect: true})

$("#id_role").change(function (e) {
    $('#id_roleaction').multiSelect('deselect_all');
    var id_role = $("#id_role").find("option:selected").val();
    //alert(id_role);
       $.getJSON("/pg/cu_RuoliAzioni/GetRoleAction",{id_role:id_role}, function(data){
        $('#id_roleaction').multiSelect('select',data)

       });

    });

$('#id_roleaction').multiSelect({
    });

$("#add_all").click( function(e){
        $('#id_roleaction').multiSelect('select_all');
});
$("#remove_all").click( function(e){
        $('#id_roleaction').multiSelect('deselect_all');
});

});
</script>
{% endblock %}
